<template>
    <div>
        <div class="crumbs">
            <div class="contentbox">
                <div class="contentsize">详情</div>
                <div>
                    <el-button @click="cacelsubmitForm('ruleForm')">返回</el-button>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="addtitle">合同信息</div>
            <div class="detailcontent">
                <div class="detailitem1">{{ projectdetail.fwdz }}</div>
                <div class="detailitem"><span style="font-weight: 700">合同编号：</span>{{ projectdetail.htbh }}</div>
                <div class="detailitem"><span style="font-weight: 700">档案编号：</span>{{ projectdetail.dabh }}</div>
                <div class="detailitem"><span style="font-weight: 700">承租单位：</span>{{ projectdetail.czr }}</div>
                <div class="detailitem"><span style="font-weight: 700">租金单价：</span>{{ projectdetail.zjdj }}</div>
                <div class="detailitem">
                    <span style="font-weight: 700">签订时间：</span>{{ projectdetail.qdsj ? projectdetail.qdsj.split(' ')[0] : '' }}
                </div>
                <div class="detailitem">
                    <span style="font-weight: 700">起租时间：</span>{{ projectdetail.zlqssj ? projectdetail.zlqssj.split(' ')[0] : '' }}
                </div>
                <div class="detailitem">
                    <span style="font-weight: 700">到期时间：</span>{{ projectdetail.zldqsj ? projectdetail.zldqsj.split(' ')[0] : '' }}
                </div>
                <div class="detailitem"><span style="font-weight: 700">出租面积：</span>{{ projectdetail.czmj }}</div>
                <div class="detailitem"></div>
            </div>
            <div class="addtitle" style="margin-top: 30px">配套信息</div>
            <el-tabs v-model="activeName" @tab-click="handleClick">
                <el-tab-pane label="水" name="first">
                    <div style="margin-bottom: 10px">
                        <el-input
                            type="textarea"
                            :autosize="{ minRows: 2, maxRows: 4 }"
                            placeholder="请输入内容"
                            v-model="shbput.shb"
                            style="width: 800px"
                            :readonly="sbshow"
                        ></el-input>
                        <el-button size="small" type="primary" style="margin-left: 20px" :disabled="!sbshow" @click="sbshow = false"
                            >修改</el-button
                        >
                        <el-button size="small" type="primary" @click="submitht('sbshow', 'shbput')" :disabled="sbshow">保存</el-button>
                    </div>
                    <div style="overflow: hidden" class="fwjgstyle">
                        <el-upload
                            class="upload-demo"
                            :action="httpUrl + '/file/uploadFile'"
                            :on-remove="handleRemoves"
                            :before-remove="beforeRemoves"
                            multiple
                            :on-success="(response, file, fileList, filetype) => handleUpSuccess(response, file, fileList, filetype, 1)"
                            :headers="myHeaders"
                            :file-list="fileList"
                            ref="upload1"
                        >
                            <el-button size="small" type="primary">点击上传</el-button>
                            <div slot="tip" class="el-upload__tip">
                                <span style="color: red; font-size: 13px">*描述内容与图片内容请保持一致</span>
                            </div>
                        </el-upload>
                        <el-table :data="sbtableData" style="width: 100%;  margin: 10px auto 10px" border>
                            <el-table-column prop="wjmc" label="文件名称" align="center"> </el-table-column>
                            <el-table-column prop="wjmc" label="文件预览" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <router-link
                                        target="_blank"
                                        :to="{ path: '/perviewfile', query: { id: scope.row.fj[0].id, type: scope.row.fj[0].suffix } }"
                                        style="color: #008a94"
                                        v-if="
                                            scope.row.fj[0].suffix == '.docx' ||
                                            scope.row.fj[0].suffix == '.doc' ||
                                            scope.row.fj[0].suffix == '.xls' ||
                                            scope.row.fj[0].suffix == '.xlsx'
                                        "
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i>
                                    </router-link>
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="redownload(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        v-else
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i
                                    ></el-button>
                                </template>
                            </el-table-column>
                            <el-table-column prop="wjmc" label="文件下载" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="downloadfile(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        style="color: blue; text-decoration: underline"
                                        >{{ scope.row.wjmc }}</el-button
                                    >
                                </template>
                            </el-table-column>
                            <el-table-column prop="cjsj" label="上传时间" align="center">
                                <template slot-scope="scope">{{ scope.row.cjsj ? scope.row.cjsj.split(' ')[0] : '' }}</template>
                            </el-table-column>

                            <el-table-column label="操作" width="100" align="center">
                                <template slot-scope="scope">
                                    <el-button type="text" size="small" @click.native.prevent="deleteRow(scope.row.id)" style="color: red"
                                        >删除</el-button
                                    >
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="电" name="second">
                    <div style="margin-bottom: 10px">
                        <el-input
                            type="textarea"
                            :autosize="{ minRows: 2, maxRows: 4 }"
                            placeholder="请输入内容"
                            v-model="dbput.db"
                            style="width: 800px"
                            :readonly="dbshow"
                        ></el-input>
                        <el-button size="small" type="primary" style="margin-left: 20px" :disabled="!dbshow" @click="dbshow = false"
                            >修改</el-button
                        >
                        <el-button size="small" type="primary" @click="submitht('dbshow', 'dbput')" :disabled="dbshow">保存</el-button>
                    </div>
                    <div style="overflow: hidden" class="fwjgstyle">
                        <el-upload
                            class="upload-demo"
                            :action="httpUrl + '/file/uploadFile'"
                            :on-remove="handleRemoves"
                            :before-remove="beforeRemoves"
                            multiple
                            :on-success="(response, file, fileList, filetype) => handleUpSuccess(response, file, fileList, filetype, 2)"
                            :headers="myHeaders"
                            :file-list="fileList"
                            ref="upload2"
                        >
                            <el-button size="small" type="primary">点击上传</el-button>
                            <div slot="tip" class="el-upload__tip">
                                <span style="color: red; font-size: 13px">*描述内容与图片内容请保持一致</span>
                            </div>
                        </el-upload>
                        <el-table :data="dbtableData" style="width: 100%;  margin: 10px auto 10px" border>
                            <el-table-column prop="wjmc" label="文件名称" align="center"> </el-table-column>
                            <el-table-column prop="wjmc" label="文件预览" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <router-link
                                        target="_blank"
                                        :to="{ path: '/perviewfile', query: { id: scope.row.fj[0].id, type: scope.row.fj[0].suffix } }"
                                        style="color: #008a94"
                                        v-if="
                                            scope.row.fj[0].suffix == '.docx' ||
                                            scope.row.fj[0].suffix == '.doc' ||
                                            scope.row.fj[0].suffix == '.xls' ||
                                            scope.row.fj[0].suffix == '.xlsx'
                                        "
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i>
                                    </router-link>
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="redownload(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        v-else
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i
                                    ></el-button>
                                </template>
                            </el-table-column>
                            <el-table-column prop="wjmc" label="文件下载" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="downloadfile(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        style="color: blue; text-decoration: underline"
                                        >{{ scope.row.wjmc }}</el-button
                                    >
                                </template>
                            </el-table-column>
                            <el-table-column prop="cjsj" label="上传时间" align="center">
                                <template slot-scope="scope">{{ scope.row.cjsj ? scope.row.cjsj.split(' ')[0] : '' }}</template>
                            </el-table-column>
                            <el-table-column label="操作" width="100" align="center">
                                <template slot-scope="scope">
                                    <el-button type="text" size="small" @click.native.prevent="deleteRow(scope.row.id)" style="color: red"
                                        >删除</el-button
                                    >
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="燃气" name="third">
                    <div style="margin-bottom: 10px">
                        <el-input
                            type="textarea"
                            :autosize="{ minRows: 2, maxRows: 4 }"
                            placeholder="请输入内容"
                            v-model="rqbput.rqb"
                            style="width: 800px"
                            :readonly="rqbshow"
                        ></el-input>
                        <el-button size="small" type="primary" style="margin-left: 20px" :disabled="!rqbshow" @click="rqbshow = false"
                            >修改</el-button
                        >
                        <el-button size="small" type="primary" @click="submitht('rqbshow', 'rqbput')" :disabled="rqbshow">保存</el-button>
                    </div>
                    <div style="overflow: hidden" class="fwjgstyle">
                        <el-upload
                            class="upload-demo"
                            :action="httpUrl + '/file/uploadFile'"
                            :on-remove="handleRemoves"
                            :before-remove="beforeRemoves"
                            multiple
                            :on-success="(response, file, fileList, filetype) => handleUpSuccess(response, file, fileList, filetype, 3)"
                            :headers="myHeaders"
                            :file-list="fileList"
                            ref="upload3"
                        >
                            <el-button size="small" type="primary">点击上传</el-button>
                            <div slot="tip" class="el-upload__tip">
                                <span style="color: red; font-size: 13px">*描述内容与图片内容请保持一致</span>
                            </div>
                        </el-upload>
                        <el-table :data="rqtableData" style="width: 100%;  margin: 10px auto 10px" border>
                            <el-table-column prop="wjmc" label="文件名称" align="center"> </el-table-column>
                            <el-table-column prop="wjmc" label="文件预览" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <router-link
                                        target="_blank"
                                        :to="{ path: '/perviewfile', query: { id: scope.row.fj[0].id, type: scope.row.fj[0].suffix } }"
                                        style="color: #008a94"
                                        v-if="
                                            scope.row.fj[0].suffix == '.docx' ||
                                            scope.row.fj[0].suffix == '.doc' ||
                                            scope.row.fj[0].suffix == '.xls' ||
                                            scope.row.fj[0].suffix == '.xlsx'
                                        "
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i>
                                    </router-link>
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="redownload(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        v-else
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i
                                    ></el-button>
                                </template>
                            </el-table-column>
                            <el-table-column prop="wjmc" label="文件下载" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="downloadfile(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        style="color: blue; text-decoration: underline"
                                        >{{ scope.row.wjmc }}</el-button
                                    >
                                </template>
                            </el-table-column>
                            <el-table-column prop="cjsj" label="上传时间" align="center">
                                <template slot-scope="scope">{{ scope.row.cjsj ? scope.row.cjsj.split(' ')[0] : '' }}</template>
                            </el-table-column>
                            <el-table-column label="操作" width="100" align="center">
                                <template slot-scope="scope">
                                    <el-button type="text" size="small" @click.native.prevent="deleteRow(scope.row.id)" style="color: red"
                                        >删除</el-button
                                    >
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="供热" name="fourth">
                    <div style="margin-bottom: 10px">
                        <el-input
                            type="textarea"
                            :autosize="{ minRows: 2, maxRows: 4 }"
                            placeholder="请输入内容"
                            v-model="ndgrfput.ndgrf"
                            style="width: 800px"
                            :readonly="ndgrfshow"
                        ></el-input>
                        <el-button size="small" type="primary" style="margin-left: 20px" :disabled="!ndgrfshow" @click="ndgrfshow = false"
                            >修改</el-button
                        >
                        <el-button size="small" type="primary" @click="submitht('ndgrfshow', 'ndgrfput')" :disabled="ndgrfshow"
                            >保存</el-button
                        >
                    </div>
                    <div style="overflow: hidden" class="fwjgstyle">
                        <el-upload
                            class="upload-demo"
                            :action="httpUrl + '/file/uploadFile'"
                            :on-remove="handleRemoves"
                            :before-remove="beforeRemoves"
                            multiple
                            :on-success="(response, file, fileList, filetype) => handleUpSuccess(response, file, fileList, filetype, 4)"
                            :headers="myHeaders"
                            :file-list="fileList"
                            ref="upload4"
                        >
                            <el-button size="small" type="primary">点击上传</el-button>
                            <div slot="tip" class="el-upload__tip">
                                <span style="color: red; font-size: 13px">*描述内容与图片内容请保持一致</span>
                            </div>
                        </el-upload>
                        <el-table :data="grtableData" style="width: 100%;  margin: 10px auto 10px" border>
                            <el-table-column prop="wjmc" label="文件名称" align="center"> </el-table-column>
                            <el-table-column prop="wjmc" label="文件预览" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <router-link
                                        target="_blank"
                                        :to="{ path: '/perviewfile', query: { id: scope.row.fj[0].id, type: scope.row.fj[0].suffix } }"
                                        style="color: #008a94"
                                        v-if="
                                            scope.row.fj[0].suffix == '.docx' ||
                                            scope.row.fj[0].suffix == '.doc' ||
                                            scope.row.fj[0].suffix == '.xls' ||
                                            scope.row.fj[0].suffix == '.xlsx'
                                        "
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i>
                                    </router-link>
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="redownload(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        v-else
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i
                                    ></el-button>
                                </template>
                            </el-table-column>
                            <el-table-column prop="wjmc" label="文件下载" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="downloadfile(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        style="color: blue; text-decoration: underline"
                                        >{{ scope.row.wjmc }}</el-button
                                    >
                                </template>
                            </el-table-column>
                            <el-table-column prop="cjsj" label="上传时间" align="center">
                                <template slot-scope="scope">{{ scope.row.cjsj ? scope.row.cjsj.split(' ')[0] : '' }}</template>
                            </el-table-column>
                            <el-table-column label="操作" width="100" align="center">
                                <template slot-scope="scope">
                                    <el-button type="text" size="small" @click.native.prevent="deleteRow(scope.row.id)" style="color: red"
                                        >删除</el-button
                                    >
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="物业" name="fifth">
                    <div style="margin-bottom: 10px">
                        <el-input
                            type="textarea"
                            :autosize="{ minRows: 2, maxRows: 4 }"
                            placeholder="请输入内容"
                            v-model="wyfput.wyf"
                            style="width: 800px"
                            :readonly="wyshow"
                        ></el-input>
                        <el-button size="small" type="primary" style="margin-left: 20px" :disabled="!wyshow" @click="wyshow = false"
                            >修改</el-button
                        >
                        <el-button size="small" type="primary" @click="submitht('wyshow', 'wyfput')" :disabled="wyshow">保存</el-button>
                    </div>
                    <div style="overflow: hidden" class="fwjgstyle">
                        <el-upload
                            class="upload-demo"
                            :action="httpUrl + '/file/uploadFile'"
                            :on-remove="handleRemoves"
                            :before-remove="beforeRemoves"
                            multiple
                            :on-success="(response, file, fileList, filetype) => handleUpSuccess(response, file, fileList, filetype, 5)"
                            :headers="myHeaders"
                            :file-list="fileList"
                            ref="upload5"
                        >
                            <el-button size="small" type="primary">点击上传</el-button>
                            <div slot="tip" class="el-upload__tip">
                                <span style="color: red; font-size: 13px">*描述内容与图片内容请保持一致</span>
                            </div>
                        </el-upload>
                        <el-table :data="wytableData" style="width: 100%; margin: 10px auto 10px" border>
                            <el-table-column prop="wjmc" label="文件名称" align="center"> </el-table-column>
                            <el-table-column prop="wjmc" label="文件预览" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <router-link
                                        target="_blank"
                                        :to="{ path: '/perviewfile', query: { id: scope.row.fj[0].id, type: scope.row.fj[0].suffix } }"
                                        style="color: #008a94"
                                        v-if="
                                            scope.row.fj[0].suffix == '.docx' ||
                                            scope.row.fj[0].suffix == '.doc' ||
                                            scope.row.fj[0].suffix == '.xls' ||
                                            scope.row.fj[0].suffix == '.xlsx'
                                        "
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i>
                                    </router-link>
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="redownload(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        v-else
                                        >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i
                                    ></el-button>
                                </template>
                            </el-table-column>
                            <el-table-column prop="wjmc" label="文件下载" align="center" :show-overflow-tooltip="true">
                                <template slot-scope="scope">
                                    <el-button
                                        type="text"
                                        size="small"
                                        @click="downloadfile(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                        style="color: blue; text-decoration: underline"
                                        >{{ scope.row.wjmc }}</el-button
                                    >
                                </template>
                            </el-table-column>
                            <el-table-column prop="cjsj" label="上传时间" align="center">
                                <template slot-scope="scope">{{ scope.row.cjsj ? scope.row.cjsj.split(' ')[0] : '' }}</template>
                            </el-table-column>
                            <el-table-column label="操作" width="100" align="center">
                                <template slot-scope="scope">
                                    <el-button type="text" size="small" @click.native.prevent="deleteRow(scope.row.id)" style="color: red"
                                        >删除</el-button
                                    >
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>
<script>
import { download, sbfjlist, sbfjadd, sbfjdelete, redownload, getsignlistupdate } from '@/api/index';
import global from '@/components/common/httpurl.vue';
import fileType from '../vo/filetype';
export default {
    name: 'fwjgfjdetail',
    data() {
        return {
            activeName: 'first',
            fileType: fileType,
            httpUrl: global.httpUrl, //公共地址
            sbtableData: [], //水表文件列表
            dbtableData: [], //电表文件列表
            rqtableData: [], //燃气文件列表
            grtableData: [], //供热文件列表
            wytableData: [], //物业文件列表
            fileListshandle: [],
            // 请求表头信息
            myHeaders: {
                token: '123'
            },
            form: {
                jmje: 0
            },
            fileList: [],
            tableData: [], //可编辑表格
            projectdetail: {}, //合同详情
            form: {},
            signid: '',
            // 文件列表传参
            sbform: {},
            dbform: {},
            rqform: {},
            grform: {},
            wyform: {},
            // 合同备注传参
            shbput: {},
            dbput: {},
            rqbput: {},
            ndgrfput: {},
            wyfput: {},
            sbshow: true, //水表显示
            dbshow: true, //电表显示
            rqbshow: true, //燃气表显示
            ndgrfshow: true, //供热显示
            wyshow: true //物业显示
        };
    },
    methods: {
        // 下载文件
        downloadfile(id, name, type) {
            console.log(id);
            let filetype = fileType[type];
            let data = {
                fileid: id
            };
            download(data).then((res) => {
                const link = document.createElement('a');
                let blob = new Blob([res], {
                    type: filetype
                });
                link.style.display = 'none';
                //设置连接
                link.href = URL.createObjectURL(blob);
                link.download = name;
                document.body.appendChild(link);
                //模拟点击事件
                link.click();
                console.log(res);
            });
        },
        // 文件预览
        redownload(id, name, type) {
            let filetype = fileType[type];
            let data = {
                fileid: id
            };
            redownload(data).then((res) => {
                console.log(res);
                let blob = new Blob([res], {
                    type: filetype
                });
                let url = window.URL.createObjectURL(blob);
                window.open(url, '_blank');
            });
        },
        // 返回
        cacelsubmitForm() {
            this.$router.go(-1);
        },
        // 文件
        handleRemoves(file, fileList, filetype) {
            console.log(file);
            console.log('filetype', filetype);
        },
        // 文件删除前
        beforeRemoves(file, fileList) {
            console.log(file);
            console.log(fileList);
            return this.$confirm(`确定移除 ${file.name}？`);
        },
        // 上传成功
        async handleUpSuccess(response, file, fileLists, filetype, num) {
            console.log(fileLists);
            console.log('filetype', filetype);
            this.$message.success('导入成功');
            console.log(num);
            await fileLists.forEach((item) => {
                console.log(item.response.data);
                let data = {
                    wjmc: item.response.data.filename,
                    signid: this.signid,
                    fj: item.response.data.id,
                    wjlx: num
                };
                console.log(data);
                this.sbfjadd(data);
            });
            this.$nextTick(() => {
                this.$refs['upload' + num].clearFiles();
            });
        },
        // 删除
        deleteRow(e) {
            console.log(e);
            this.$confirm('确定删除此文件吗？')
                .then(() => {
                    console.log(e);
                    let data = {
                        id: e
                    };
                    this.sbfjdelete(data);
                    this.$message.success('删除成功');
                })
                .catch(() => {
                    this.$message.error('删除取消');
                });
        },
        // 水表附件列表
        sbfjlist(data) {
            sbfjlist(data).then((res) => {
                if (res.code == 200) {
                    console.log(res.data);
                    this.sbtableData = res.data.records;
                } else {
                    this.sbtableData = [];
                }
            });
        },
        // 电表附件列表
        dbfjlist(data) {
            sbfjlist(data).then((res) => {
                if (res.code == 200) {
                    console.log(res.data);
                    this.dbtableData = res.data.records;
                } else {
                    this.dbtableData = [];
                }
            });
        },
        // 燃气附件列表
        rqfjlist(data) {
            sbfjlist(data).then((res) => {
                if (res.code == 200) {
                    console.log(res.data);
                    this.rqtableData = res.data.records;
                } else {
                    this.rqtableData = [];
                }
            });
        },
        // 供热附件列表
        grfjlist(data) {
            sbfjlist(data).then((res) => {
                if (res.code == 200) {
                    console.log(res.data);
                    this.grtableData = res.data.records;
                } else {
                    this.grtableData = [];
                }
            });
        },
        // 供热附件列表
        wyfjlist(data) {
            sbfjlist(data).then((res) => {
                if (res.code == 200) {
                    console.log(res.data);
                    this.wytableData = res.data.records;
                } else {
                    this.wytableData = [];
                }
            });
        },
        // 水表附件新增
        sbfjadd(data) {
            sbfjadd(data).then((res) => {
                console.log('上传文件！！');
                this.sbfjlist(this.sbform);
                this.dbfjlist(this.dbform);
                this.rqfjlist(this.rqform);
                this.grfjlist(this.grform);
                this.wyfjlist(this.wyform);
            });
        },
        // 水表附件删除
        sbfjdelete(data) {
            sbfjdelete(data).then((res) => {
                console.log('删除文件！！');
                this.sbfjlist(this.sbform);
                this.dbfjlist(this.dbform);
                this.rqfjlist(this.rqform);
                this.grfjlist(this.grform);
                this.wyfjlist(this.wyform);
            });
        },
        // 换页操作
        handleClick(tab, event) {
            console.log(tab, event);
        },
        // 合同修改
        submitht(name, form) {
            this[name] = !this[name];
            this.getsignlistupdate(this[form]);
        },
        //编辑数据接口
        getsignlistupdate(data) {
            getsignlistupdate(data).then((res) => {
                if (res.code == 200) {
                    this.$message.success('修改成功！！！');
                } else {
                    this.$message.error('修改失败！！！');
                }
            });
        }
    },
    created() {
        console.log(this.$route.query.data);
        this.projectdetail = JSON.parse(this.$route.query.data);
        this.signid = this.projectdetail.id;
        // 合同内容修改内容
        this.shbput = {
            id: this.projectdetail.id,
            shb: this.projectdetail.shb
        };
        this.dbput = {
            id: this.projectdetail.id,
            db: this.projectdetail.db
        };
        this.rqbput = {
            id: this.projectdetail.id,
            rqb: this.projectdetail.rqb
        };
        this.ndgrfput = {
            id: this.projectdetail.id,
            ndgrf: this.projectdetail.ndgrf
        };
        this.wyfput = {
            id: this.projectdetail.id,
            wyf: this.projectdetail.wyf
        };

        // 文件列表接口操作
        this.sbform = {
            signid: this.projectdetail.id,
            wjlx: 1
        };
        this.sbfjlist(this.sbform);
        this.dbform = {
            signid: this.projectdetail.id,
            wjlx: 2
        };
        this.dbfjlist(this.dbform);
        this.rqform = {
            signid: this.projectdetail.id,
            wjlx: 3
        };
        this.rqfjlist(this.rqform);
        this.grform = {
            signid: this.projectdetail.id,
            wjlx: 4
        };
        this.grfjlist(this.grform);
        this.wyform = {
            signid: this.projectdetail.id,
            wjlx: 5
        };
        this.wyfjlist(this.wyform);
    }
};
</script>
<style>
.el-upload-list {
    width: 60%;
}

.fwjgstyle .el-upload--text {
    width: auto;
    height: auto;
    overflow: hidden;
    border: none;
}
</style>
<style scoped>
.container {
    overflow: hidden;
}

.crumbs {
    background-color: #fff;
    padding: 20px 20px;
}

.indexTitle {
    margin-bottom: 20px;
}

.contentbox {
    display: flex;
    justify-content: space-between;
}

.contentsize {
    font-size: 18px;
    font-weight: 700;
    line-height: 32px;
    color: #606266;
}

.handle-box {
    overflow: hidden;
}

.addtitle {
    width: 100%;
    border-bottom: 1px solid #eeeeee;
    padding-bottom: 20px;
    box-sizing: border-box;
    margin-bottom: 20px;
    font-weight: 700;
}

.buttonCenter {
    width: 12%;
    margin: auto;
}

.unloadTitle {
    text-align: left;
    padding-bottom: 10px;
    box-sizing: border-box;
    color: #606266;
}

/* 搜索按钮 */
.searchcolor {
    background-color: #7090ff;
}

.detailcontent {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.detailcontent .detailitem {
    /* float: left; */
    width: 33%;
    margin-bottom: 30px;
}
/* .detailcontent .detailitem2{
    width: 66%;
    margin-bottom: 30px;
} */
.detailcontent .detailitem1 {
    /* float: left; */
    width: 99%;
    margin-bottom: 30px;
    font-weight: 700;
    color: #008a94;
}
</style>